<script type="text/javascript">
$(document).ready(function () {
    var dataSource = {
        datatype: "json",
        cache: false,
        datafields: [
                { name: 'ma_nghe_si', type: 'int' },
                { name: 'nghe_danh', type: 'string' }
        ],
        url: 'libs/DSNgheSi_ChuaCoNhom.php'
    };
    var dataAdapter = new $.jqx.dataAdapter(dataSource);
    var nghedanh_renderer = function(row, columnfield, value){
        var data = $('#danhsach_nghesi_chuaconhom').jqxGrid('getrowdata', row);
        var id = data["ma_nghe_si"];
        var fileName= "img/nghe_si/" + id + ".png";
        var res = '<img src="' + fileName + '" width="40px" height="40px" style="vertical-align: middle;" onerror="changeSrc(this);"/>  ' + 
                '<strong>' + value + '</strong>';      
        return res;
    };
    $("#danhsach_nghesi_chuaconhom").jqxGrid({
        width: 300,
        height:350,
        theme:theme,
        source: dataAdapter,
        sortable: true,
        pageable:true,
        showheader: true,
        rowsheight: 40,
        //autoheight: true,
        columns: [
            { text: 'Mã', datafield: 'ma_nghe_si', width: 50, hidden: false },
            { text: 'Nghệ danh', datafield: 'nghe_danh', width: 250, hidden: false, cellsrenderer: nghedanh_renderer }
            ]
    });
});
</script>
<div id="danhsach_nghesi_chuaconhom" style="float: left"></div>
